<template>
  <el-row class="app-container">
    <el-col :span="12">
      <img src="../assets/images/gif_404.gif" alt="404" class="img-style">
    </el-col>
    <el-col :span="12">
      <div class="right-container">
        <h1>oh!no!!</h1>
        <h2>很抱歉，您的页面走丢了！</h2>
        <p>请检查输入的网址是否正确，请点击按钮返回主页!</p>
        <el-button type="danger" round @click="$router.replace('/')">返回首页</el-button>
      </div>
    </el-col>
  </el-row>
</template>

<script>
export default {

}
</script>

<style lang="less" scoped>
.app-container {
  width: 80%;
  margin: 120px auto;
  .img-style {
    width: auto;
    height: auto;
    max-width: 100%;
    min-width: 100%;
  }
  .right-container {
    margin-left: 100px;
    margin-top: 60px;
  }
}
</style>